<template>
  <div class="app-container calendar-list-container">
    <search :list="queryList" :queryEntity="queryEntity"></search>
    <buttons :showQuery="true" :showBack="false" @query="doQuery" :list="btnList" :disabled="disabled" placeholder="订单号" :permissions="permissions"></buttons>
    <grid gridTitle="退货订单" :columns="columns" :enableEdit="false" :url="url" :loading="true" ref="mainGrid" height="auto" diffHeight="145" :pagination="true"
      :permissions="permissions" :queryEntity="queryEntity" :multi="false" @change="rowCilck" @edit="doEdit" @view="doView" @pass="doPass" @cancel="doCancel" @delete="doDelete">
    </grid>

  </div>
</template>
<script>
import request from '@/router/axios'
import { Message, MessageBox } from 'element-ui'
import url from '@/const/apiURL'
import GridDialog from '@/components/GridDialog'
import grid from '@/components/Grid'
import { mapGetters } from 'vuex'
import { queryField } from '@/const/query'
import buttons from '@/components/Buttons'
import { PurchaseInOrderStatusFormatter, YesOrNoFormatter } from '@/const/dict'
import search from '@/components/Search'
import { colunms } from '@/const/colunms'
import { dict } from '@/const/dict'

export default {
  components: { GridDialog, grid, buttons, search },
  data () {
    return {
      orderNo: '',
      customerName: '',
      url: url.SALE_BACK_LIST_URL,
      disabled: true,
      queryEntity: { orderNo: null, includeStatus: ["UN_IN", "UN_CHECK", "FINISH"] },
      entity: {},
      columns: [
        {
          label: '操作', width: 160, prop: 'op', align: 'center', template: 'op', opList: [
            { name: '编辑', clickName: 'edit', auth: 'm_sale_back_edit', valueProp: "orderStatus", showValue: ["UN_CHECK"] },
            { name: '查看', clickName: 'view', auth: 'm_sale_back_view' },
            { name: '通过', clickName: 'pass', auth: 'm_sale_back_pass', confirm: true, valueProp: "orderStatus", showValue: ["UN_CHECK"] },
            { name: '取消', clickName: 'cancel', auth: 'm_sale_back_cancel', confirm: true, valueProp: "orderStatus", showValue: ["UN_IN", "FINISH"] },
            { name: '删除', clickName: 'delete', auth: 'm_sale_back_delete', confirm: true, valueProp: "orderStatus", showValue: ["UN_CHECK"] }
          ]
        },
        { label: '采购单号', width: 180, prop: 'orderNo', align: 'left' },
        { label: '退货单号', width: 180, prop: 'backCode', align: 'left' },
        { label: '仓库名称', width: 100, prop: 'warehouseName', align: 'center' },
        { label: '客户名称', width: 200, prop: 'customerName', align: 'center' },
        { label: '卷数', width: 80, prop: 'total', align: 'center' },
        { label: '退货数量', width: 80, prop: 'quantity', align: 'center' },
        { label: '总价', width: 80, prop: 'totalAmount', align: 'center' },
        { label: '是否对账', width: 80, prop: 'billStatus', align: 'center', formatter: YesOrNoFormatter },
        { label: '订单状态', width: 80, prop: 'orderStatus', align: 'center', formatter: PurchaseInOrderStatusFormatter },
        { label: '创建时间', width: 100, prop: 'createTime', align: 'center' }
      ],
      btnList: [
        // { name: '编辑', type: 'primary', icon: 'edit', click: 'edit', auth: 'm_sale_back_edit', ctr: true },
        //  { name: '查看', type: 'primary', icon: 'edit', click: 'view', auth: 'm_sale_back_view', ctr: true },
        // { name: '通过', type: 'primary', icon: 'edit', click: 'pass', auth: 'm_sale_back_pass', ctr: true, confirm: true },
        //  { name: '取消', type: 'primary', icon: 'edit', click: 'cancel', auth: 'm_sale_back_cancel', ctr: true, confirm: true },
        // { name: '删除', type: 'primary', icon: 'edit', click: 'delete', auth: 'm_sale_back_delete', ctr: true, confirm: true }
      ],
      queryList: [
        { name: '采购单号', type: 'text', prop: 'orderNo', placeholder: "采购单号" },
        { name: '退货单号', type: 'text', prop: 'backCodeLike', placeholder: "退货单号" },
        { name: '创建时间', type: 'date', prop: 'startTime', placeholder: "" },
        { name: '----', type: 'date', prop: 'endTime', placeholder: "", },
        { name: '客户名称', type: 'query', prop: 'customerCode', rowValue: 'customerCode', rowName: 'customerName', url: url.CUSTOMER_LIST_URL, columns: colunms().customerColumns, pagination: true, queryList: queryField().customer, queryEntity: { customerType: 'SUPPLIER' } },
        { name: '订单状态', type: 'select', prop: 'orderStatus', placeholder: "订单状态", values: dict().PurchaseOrderStatus, label: 'name', value: 'value' }
      ]
    }
  },
  created () {
    this.orderNo = this.$route.query.orderNo
    this.customerName = this.$route.query.customerName
    this.queryEntity.orderNo = this.$route.query.orderNo
  },
  computed: {
    ...mapGetters(['permissions'])
  },
  methods: {
    doQuery (text) {
      this.$refs['mainGrid'].doQuery(text)
    },
    rowCilck (row) {
      this.disabled = row.length == 0
    },
    doEdit (row) {
      // const row = this.$refs['mainGrid'].getSelectOne()
      if (row) {
        this.$router.push({ path: '/prod/sale/back/edit', query: { orderNo: row.orderNo, customerName: row.customerName, backCode: row.backCode, index: true } })
      }
    },
    doView (row) {
      // const row = this.$refs['mainGrid'].getSelectOne()
      if (row) {
        this.$router.push({ path: '/prod/sale/back/view', query: { orderNo: row.orderNo, customerName: row.customerName, backCode: row.backCode, index: true } })
      }
    },
    openOrder () {
      this.$refs['orderGridDialog'].show()
    },
    selectOrderData (row) {
      this.orderNo = row.orderNo
      this.initData()
    },
    doCancel (row) {
      // const row = this.$refs['mainGrid'].getSelectOne()
      if (row) {
        this.cancelOp(row.backCode).then(data => {
          if (data) {
            this.$refs['mainGrid'].reload()
          }
        })
      }
    },
    cancelOp (backCode) {
      return request({
        url: url.SALE_BACK_CANCEL_URL,
        method: 'post',
        data: { key: 'key' },
        params: { backCode: backCode }
      })
    },
    doDelete (row) {
      // const row = this.$refs['mainGrid'].getSelectOne()
      if (row) {
        this.deleteOp(row.backCode).then(data => {
          if (data) {
            this.$refs['mainGrid'].reload()
          }
        })
      }
    },
    deleteOp (backCode) {
      return request({
        url: url.SALE_BACK_DELETE_URL,
        method: 'post',
        data: { key: 'key' },
        params: { backCode: backCode }
      })
    },
    doPass (row) {
      //const row = this.$refs['mainGrid'].getSelectOne()
      if (row) {
        this.passOp(row.backCode).then(data => {
          if (data) {
            this.$refs['mainGrid'].reload()
          }
        })
      }
    },
    passOp (backCode) {
      return request({
        url: url.SALE_BACK_PASS_URL,
        method: 'post',
        data: { key: 'key' },
        params: { backCode: backCode }
      })
    }
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.w-body {
  padding-top: 8px;
}
.w-table {
  border: 1px solid #ebeef5;
}
.w-table-title {
  border: 1px solid #ebeef5;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  word-break: break-all;
  line-height: 23px;
  display: inline-block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  vertical-align: middle;
  width: 100%;
  font-size: 14px;
  color: gray;
}
</style>
